import * as React from 'react';
import {
  View,
  Text,
  Pressable,
  StyleSheet,
  StatusBar,
 } from 'react-native';
import { createNativeStackNavigator } from '@react-navigation/native-stack';
import JjdList from './JJDPages/jjdList';
import FkdList from './FKDPages/fkdList';
import AddFkd from './FKDPages/fkdadd';
import Demo from '../pages/tableDemo';

function Card({id,title, navigation,route}){
  const path = route["path"];
  return (
    <View style={styles.card}>
      <Pressable onPress={()=> navigation.navigate(path)} style={styles.screen}>
        <Text adjustsFontSizeToFit={true} style={styles.cardtext}>{title}</Text>
      </Pressable>
    </View>
  )
}

function Homepage({navigation}){
  // console.log('加载了Homepage菜单页');
  return (
    <View style={styles.screen}>
      <Card id='fkd' title='反馈单' navigation={navigation} route={{path: 'fkdList'}}></Card>
      <Card id='jjd' title='接警单' navigation={navigation} route={{path: 'jjdList'}}></Card>
      <Card id='demo' title='tabledemo' navigation={navigation} route={{path: 'demo'}}></Card>
    </View>
  );
}
const homestack = createNativeStackNavigator();

function HomeScreen() {
  // console.log('加载了Home stack')
  return (
    <homestack.Navigator>
      <homestack.Screen
        name="homepage" 
        component={Homepage}
        options={{headerShown: false}}
      />
      <homestack.Screen
        name="jjdList" 
        component={JjdList} 
      />
      <homestack.Screen
        name="fkdList"
        component={FkdList}
      />
      <homestack.Screen
        name="addfkd"
        component={AddFkd}
      />
      <homestack.Screen
        name="demo"
        component={Demo}
      />
    </homestack.Navigator>
  );
}

const styles = StyleSheet.create({
  screen: {
    flex: 1,
    marginTop: StatusBar.currentHeight || 0,
    alignItems: 'center',
    justifyContent: 'center',
  },
  card: {
    height: 100,
    width: 500,
    marginVertical: 8,
    marginHorizontal: 30,
    borderWidth: 1,
    borderColor: 'gray',
    borderRadius: 4,
    backgroundColor: 'lightblue',
    alignItems: 'center',
    justifyContent: 'center',
  },
  cardtext:{
    fontSize: 24,
  }
})

export default HomeScreen;